<div ng-if="groups.isRoot">
  <div class="alert alert-info">
    <a ng-link="users({id: 'all'})" class="category" ng-class="{active: !groups.activeGroup}" translate>group.allusers</a>
    <hr>
    <div class="create-btn">
      <a ng-link="newUser" class="btn btn-default" translate>group.newuser</a>
      <a ng-click="groups.createGroup()" class="btn btn-default" translate>group.newgroup</a>
    </div>
  </div>

  <input ng-if="groups.isRoot" ng-model="groups.q" class="form-control input-sm" placeholder="{{'group.search' | translate}}">

  <h5 ng-if="groups.q == ''" translate>group.system</h5>
  <div ng-repeat="group in groups.adminList" ng-if="groups.q == ''">
    <strong ng-if="(groups.activeGroup.cn == group.cn)">
      {{::group.cn}} ({{::group.users.length}})
    </strong>
    <a ng-link="users({id: group.cn})" ng-if="(groups.activeGroup.cn != group.cn)">
      {{::group.cn}}
     ({{::group.users.length}})
   </a>
  </div>
</div>

<h5 ng-if="groups.isRoot && groups.q == ''" translate>group.app</h5>

<div ng-if="groups.q == ''">

  <a ng-if="groups.enableBack" class="btn btn-default btn-xs" ng-link="users({id: groups.prefix.parent})">
    «
  </a>
  <span ng-if="groups.enableBack">{{groups.prefix.cn || 'group.all' | translate }}</span>

  <div ng-repeat="group in groups.tree" ng-if="groups.filter(group, groups.activeGroup)">

    <strong ng-if="(groups.activeGroup.cn == group.cn) && (group.children.length == 0)">
      {{::group | unprefix: groups.prefix}} ({{::group.users.length}})
    </strong>
    <a ng-link="users({id: group.cn})" title={{::group.description}}
      ng-if="(groups.activeGroup.cn != group.cn) && (groups.prefix.cn.indexOf(group.cn)!=0)">
      <span ng-if="group.children.length > 0">+</span>
      {{::group | unprefix: groups.prefix}} ({{::group.users.length}})
    </a>

    <groups groups="group.children" active-promise="groups.activePromise" index="groups.index"
    ng-if="groups.isExpanded(group, groups.activeGroup)"></groups>

  </div>

</div>

<div ng-repeat="(key, group) in groups.index" ng-if="groups.isRoot && groups.q != ''">
  <a ng-link="users({id: group.cn})" title={{::group.description}}
      ng-if="group.cn.toLowerCase().indexOf(groups.q.toLowerCase()) >= 0">
    {{::group.cn}} ({{::group.users.length}})
  </a>
</div>
